<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>咸鱼云资源站（开发中）</title>
    <script src="/src/js/base.js"></script>
    <link rel="stylesheet" href="/src/css/base.css">
    <link rel="stylesheet" href="/src/css/list.css">
    <link rel="stylesheet" href="/src/css/icon.css">
    <style>
        #search input{
            width: 280px;
            padding: 4px 10px;
            border: 1px solid darkgray;
            border-radius: 5px 0 0 5px;
            border-right-width: 0;
            outline: none;
        }
        #search button{
            border: 1px solid darkgray;
            border-radius: 0 5px 5px 0px;
            border-left: 1px solid #eee;
        }
    </style>
</head>
<body>
    <div id="app" class="app">
        <div style="margin: 10px;">当前路径：
            <ul id="path" class="path-tag">
                <li><a href="/<?php echo env("PUBLIC_PREFIX")?>">/</a></li>
            </ul>
        </div>
        <a href="https://www.xiaotao2333.top:23333/pack_old/<?php echo $uri ?>"><button class="primary">旧版</button></a>
        <a href="/page/contribute.html?uri=<?php echo $uri ?>"><button style="position: relative;"><img src="/src/imgs/icon/upload.png" style="position:absolute;width: 16px; height:16px;left:10px;opacity:0.4" alt=""><span style="text-indent: 2em;display:inline-block">贡献资源</span></button></a>
        <a href="/page/musicPlayer.html"><button>咸鱼云音乐（开发中）</button></a>
        <form target="_blank" action="/page/search.html" style="display:inline-flex" id="search">
            <input placeholder="文件搜索 支持空格分割关键词" type="text" name="key">
            <button>搜索</button>
        </form>
        <ul id="list">
            <li class="item head" style="background-image:none">
                <div class="content">文件名</div>
                <span class="size">大小</span>
                <span class="date">修改日期</span>
                <span class="from">来源</span>
            </li>
            <li class="item" style="background-image: url('/src/imgs/icon/return.png');background-size: 16px 16px;background-position: 10px">
                <div class="content"> <a href="{{$full_uri}}/../">上一级</a> </div>
                <span style="flex-grow: 6;"></span>
            </li>
            @foreach ($dirs as $dir)
            <li class="item dir">
                <a class="content"  href="{{$dir['link']}}"> {{$dir['name']}} </a>
                <span class="size">-</span>
                <span class="date">{{$dir['date']}}</span>
                <span class="from">{{$dir['from']}}</span>
            </li>
            @endforeach

            @foreach ($files as $file)
            <li class="item file type-<?php echo $file['type']?>">
                <a class="content"  href="{{$file['link']}}"> {{$file['name']}} </a>
                <span class="size">{{$file['size']}}</span>
                <span class="date">{{$file['date']}}</span>
                <span class="from">{{$file['from']}}</span>
            </li>
            @endforeach
        </ul>
    </div>
    <script>
        path = document.getElementById("path")
        paths = location.pathname.replace(/\/+$/,'').replace(/\/+/g,'/').split('/')
        paths.shift();
        prefix = paths.shift()
        console.log(prefix);
        for (let i = 0; i < paths.length; i++) {
            var e = paths[i]
            var li = document.createElement("li")
            var link = '/' + prefix + '/'
            for (let j = 0; j <= i; j++) {
                link += paths[j]+'/'
            }
            li.innerHTML = "<a href=\"" + link + "\">" + decodeURI(e) + "</a>"
            path.appendChild(li)
        }
    </script>
</body>
</html>
